
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:syn_4s/core/extension/int_extension.dart';
import 'package:syn_4s/core/model/map_all_device_model.dart';
import 'package:syn_4s/core/services/config.dart';
import 'package:syn_4s/ui/shared/app_theme.dart';
import 'package:syn_4s/ui/widgets/dialog_title.dart';
import 'package:syn_4s/ui/widgets/google_map_item.dart';
import 'package:syn_4s/ui/widgets/shadow_container.dart';

class GoogleMapMonitoringDialog extends StatelessWidget {

  final String title;
  final MapAllDeviceModel? data;

  const GoogleMapMonitoringDialog(this.title, this.data, {super.key});

  @override
  Widget build(BuildContext context) {
    return ShadowContainer(
      padding: EdgeInsets.all(8.px),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          DialogTitle(title, ""),
          buildMonitoringInfo(),
          GoogleMapItem(data)
        ],
      ),
    );
  }

  Widget buildMonitoringInfo() {
    return Container(
      height: 120.px,
      width: double.infinity,
      margin: EdgeInsets.only(top: 10.px, left: 6, right: 6.px),
      child: Stack(
        alignment: AlignmentDirectional.bottomEnd,
        children: [
          Container(
            width: double.infinity,
            child: Image.network(
              "${HttpConfig.imageURL}${data?.photo}",
              fit: BoxFit.cover,
            ),
          ),
          Container(
            width: double.infinity,
            color: AppTheme.toastBgColors.withOpacity(0.4),
            padding: EdgeInsets.symmetric(horizontal: 6.px, vertical: 2.px),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                setText(data!.deviceName!, color: Colors.white, size: 12.px),
                setText(data!.lastAt!, color: Colors.white, size: 12.px)
              ],
            ),
          )
        ],
      ),
    );
  }

  Widget setText(String text,{double? size, FontWeight? fontWeight, Color color = AppTheme.textColor}){
    return Text(
      text,
      style: TextStyle(
          fontSize: size,
          fontWeight: fontWeight,
          color: color
      ),
      overflow: TextOverflow.ellipsis,
      maxLines: 1,
    );
  }

}
